<template>
    <div class="textshow-container pb-16">
        <div class="box container pb-16">
            <div class="top">
                <el-image :src="news.newsUrl == undefined ? 'https://imgbed.link/file/15728' : news.newsUrl"
                    :fit="'fill'"></el-image>
            </div>
            <div class="body p-16">
                <div class="title ">
                    <div class=" title-name  mb-4 font-blod text-4xl text-left font-bold">{{ news.newsTitle }}</div>
                    <p class=" text-gray-700 pl-2">{{ news.newsTime }}</p>
                </div>
                <div class="introduce mt-12">
                    <p>
                    {{ news.newsIntroduce }}
                    </p>
                </div>
                <div class="footer">

                </div>
            </div>

        </div>


    </div>
</template>

<script>


export default {
    name: '',

    data() {
        return {
            gridImg: {
                url: require("@/image/swiper-04.jpg")
            },
            news: {},
        }
    },
    methods: {
        getNews(value) {
            console.log(value)
            this.$axios.postInfo("/queryNews", value).then(res => {
                console.log(res)
                this.news = res.news
            })
        }
    },
    created() {
        let query = this.$route.query
        console.log(query)
        this.getNews(query)
    }
}

</script>
<style  lang="less" scoped>
.textshow-container {
    padding-top: 120px;
    width: 100%;
    min-height: 80vh;


    .box {
        background: #fff;
        box-shadow: 4px 4px 6px rgb(143, 140, 140);
        @apply rounded-lg;

        .body {
            position: relative;
            width: 100%;

            p {
                text-align: left;
            }
            .title{
                .title-name{
                    border-bottom: 1px solid gray;
                }
            }
        }
    }


}
</style>